﻿<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <link rel="Shortcut Icon" href="../images/aecc.ico" type="image/x-icon" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../StaticFiles/element-ui/element-ui.css">
  <link rel="stylesheet" href="../StaticFiles/nprogress/nprogress.min.css">
  <link rel="stylesheet" href="../styles/vue-page-common.css">
  <script src="../Scripts/vue.min.js"></script>
  <script src="../StaticFiles/element-ui/element-ui.js"></script>
  <script src="../Scripts/axios.min.js"></script>
  <script src="../StaticFiles/nprogress/nprogress.min.js"></script>
  <script src="../Scripts/dayjs.min.js"></script>
  <script src="../Scripts/axios.config.js"></script>
  <title>零件进度表</title>
  <style>
    .green {
      color: #0fd850 !important;
    }

    .el-table__cell {
      text-align: left !important;
    }

    /* 固定列部分分辨率下不能拖动bugfix */
    /* .el-table__fixed {
      height: auto !important;
      bottom: 20px !important;
    } */

    .info-label {
      font-weight: bold;
      color: cornflowerblue;
    }

    .info-tag {
      display: inline-block;
      height: 24px;
      padding: 0 8px;
      line-height: 22px;
      font-size: 12px;
      /* color: #409EFF; */
      border-width: 1px;
      border-style: solid;
      border-radius: 4px;
      box-sizing: border-box;
      white-space: nowrap;
    }

    /* 已完工 */
    .finished {
      background-color: #67c23a;
      border-color: #67c23a;
      color: #fff;
    }

    /* 部分完工 */
    .part-finished {
      background-color: seagreen;
      border-color: seagreen;
      color: #fff;
    }

    /* 转工转回 */
    .shipreturn {
      background-color: #f0f9eb;
      border-color: #e1f3d8;
      color: #67c23a;
    }

    /* 已派工 */
    .dispatched {
      background-color: #e6a23c;
      border-color: #e6a23c;
      color: #fff;
    }

    /* 待领工 */
    .toreceive {
      background-color: #e6a23c;
      border-color: #e6a23c;
      color: #fff;
    }

    /* 待报工 */
    .toworkreport {
      background-color: #2B68D8;
      border-color: #2B68D8;
      color: #fff;
    }

    /* 未开始 */
    .notstart {
      border-color: #000;
      color: #000;
    }

    /* 不加工 */
    .undo {
      background-color: #f4f4f5;
      border-color: #e9e9eb;
      color: #909399;
    }

    /* 外委工序 */
    .commission-step {
      background-color: #909399;
      border-color: #909399;
      color: #fff;
    }

    /* 已报工 */
    .reported {
      background-color: #409EFF;
      border-color: #409EFF;
      color: #fff;
    }

    /* 外委转出 */
    .commission-sendout {
      background-color: brown;
      border-color: brown;
      color: #fff;
    }

    /* 外委转回 */
    .commission-return {
      background-color: #f0f9eb;
      border-color: #e1f3d8;
      color: #0fd850;
    }

    /* 检验待处理 */
    .checker-todeal {
      background-color: fuchsia;
      border-color: fuchsia;
      color: #fff;
    }

    /* 子工艺工序 */
    .sub-workflowstep {
      background-color: #c69;
      border-color: #c69;
      color: #fff;
    }

    /* 待转出 */
    .to-sendout {
      background-color: brown;
      border-color: brown;
      color: #fff;
    }

    /* 待接收 */
    .to-receive {
      background-color: cadetblue;
      border-color: cadetblue;
      color: #fff;
    }

    /* 转工拒收 */
    .ship-reject {
      background-color: brown;
      border-color: brown;
      color: #fff;
    }

    /* 待完成 */
    .to-finish {
      background-color: lightsalmon;
      border-color: lightsalmon;
      color: #fff;
    }

    /* 转工待转回 */
    .to-ship-return {
      background-color: #f0f9eb;
      border-color: #e1f3d8;
      color: #67c23a;
    }

    /* 待审理 */
    .to-verify {
      background-color: aqua;
      border-color: aqua;
      color: #000;
    }

    /* 有质量问题 */
    .have-quality-problem {
      background-color: red;
      border-color: red;
      color: #fff;
    }
  </style>
</head>

<body>
  <div id="app" v-cloak v-on:keyup.enter="getData()">
    <vue2-report-header :title="'零件进度表'"></vue2-report-header>
    <div style="padding: 10px;" id="queryZone">
      <!-- 查询条件区 -->
      <el-form :inline="true" :model="queryInfo" ref="queryInfoRef" :label-position="'left'" :disabled="formDisabled">
        <el-form-item label="主制分厂:" prop="factoryid">
          <el-select v-model="queryInfo.factoryid" placeholder="请选择主制分厂" clearable filterable @change="bindControl"
            :disabled="factoryDisabled">
            <el-option v-for="f in factoryList" :key="f.factoryid" :label="f.factoryname" :value="f.factoryid">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="主制工区:">
          <el-select v-model="queryInfo.workcenterid" placeholder="请选择主制工区" clearable filterable>
            <el-option v-for="p in workcenterList" :key="p.workcenterid" :label="p.workcentername"
              :value="p.workcenterid">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item prop='mfgordername' label="订单号:">
          <el-autocomplete v-model.trim="queryInfo.mfgordername" placeholder="请输入订单号" :trigger-on-focus="false"
            :fetch-suggestions="searchMfgorderAsync" :value-key="'mfgordername'" :debounce="500" style="width:230px;">
          </el-autocomplete>
        </el-form-item>

        <el-form-item prop='productname' label="件号:">
          <el-autocomplete v-model.trim="queryInfo.productname" placeholder="请输入件号" :trigger-on-focus="false"
            :fetch-suggestions="searchProductAsync" :value-key="'productname'" :debounce="500" style="width: 280px;">
          </el-autocomplete>
        </el-form-item>

        <el-form-item prop='containername' label="流水卡号:">
          <el-autocomplete v-model.trim="queryInfo.containername" placeholder="请输入流水卡号" :trigger-on-focus="false"
            :fetch-suggestions="searchContainerAsync" :value-key="'containername'" :debounce="500"
            @select="handleContainernameSelect" style="width: 340px;" @blur="containernameBlur">
          </el-autocomplete>
        </el-form-item>

        <el-form-item label="在制状态:">
          <el-select v-model="queryInfo.status" placeholder="请选择" clearable filterable style="width: 120px;">
            <el-option :key="'在制'" :label="'在制'" :value="'0'"></el-option>
            <el-option :key="'完工入库'" :label="'完工入库'" :value="'1'"></el-option>
            <el-option :key="'领料中'" :label="'领料中'" :value="'-1'"></el-option>
            <el-option :key="'已关闭'" :label="'已关闭'" :value="'2'"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item prop="workflow" label="历史加工工艺:">
          <el-select v-model="queryInfo.workflowid" placeholder="请选择历史加工工艺" style="width: 300px;">
            <el-option v-for="w in workflowList" :key="w.workflowid" :label="w.workflowinfo" :value="w.workflowid">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="机型:">
          <el-select v-model="queryInfo.productfamilyname" placeholder="请选择机型" clearable filterable>
            <el-option v-for="p in productfamilyList" :key="p.productfamilyname" :label="p.productfamilyname"
              :value="p.productfamilyname">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item prop="selectdate" label="开卡时间:">
          <el-date-picker v-model="queryInfo.selectdate" type="daterange" range-separator="至" value-format="yyyy-MM-dd"
            start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"></el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="small" @click="getData">查询</el-button>
        </el-form-item>
      </el-form>

      <!-- 主表格 -->
      <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
        element-loading-background="rgba(0,0,0,0.8)" :data="dataList" stripe border ref="table">
        <el-table-column type="index" width="50px" fixed></el-table-column>
        <el-table-column label="流水卡号" prop="containername" width="400" show-overflow-tooltip fixed>
          <template slot-scope="scope">
            <span v-if="scope.row.ishold === '1'">
              <el-tag type="info" effect="dark" size="small">已冻结</el-tag>
            </span>
            <span v-else>
              <el-tag v-if="scope.row.isinstore === 1" type="success" effect="dark" size="small">已入库</el-tag>
              <el-tag v-else-if="scope.row.isinstore === -1" type="danger" effect="dark" size="small">领料中</el-tag>
              <el-tag v-else-if="scope.row.isinstore === 2" type="info" effect="dark" size="small">已关闭</el-tag>
              <el-tag v-else effect="dark" size="small">在制中</el-tag>
            </span>
            <span>
              <el-link type="primary" @click="showContainerInfo(scope.row)">{{scope.row.containername}}
              </el-link>
            </span>

            <el-popover placement="top-start" title="" width="300" trigger="hover">
              <i class="el-icon-info" slot="reference"></i>
              <p>
                <span class="info-label">批次类型：</span>
                <el-tag effect="dark">{{scope.row.containertype}}</el-tag>
              </p>
              <p><span class="info-label">当前工序：</span> {{scope.row.workflowstepname}}</p>
              <p><span class="info-label">数量：</span> {{scope.row.qty}}</p>
              <p><span class="info-label">零件名称：</span>{{scope.row.productdescription}}</p>
              <p><span class="info-label">零件版本：</span>{{scope.row.productrevision}}</p>
              <p><span class="info-label">批次主制分厂：</span>{{scope.row.factoryname}}</p>
              <p><span class="info-label">主制工区：</span>{{scope.row.fromworkcentername}}</p>
              <p><span class="info-label">订单号：</span>{{scope.row.mfgordername}}</p>
              <p><span class="info-label">订单数量：</span>{{scope.row.mfgqty}}</p>
              <p>
                <span class="info-label">订单状态：</span>
                <el-tag effect="dark" :type="scope.row.orderstatusname === '打开' ? 'primary' : 'danger'">
                  {{scope.row.orderstatusname}}
                </el-tag>
              </p>
              <p><span class="info-label">订单计划开始时间：</span>{{scope.row.plannedstartdate}}</p>
              <p><span class="info-label">订单计划完成时间：</span>{{scope.row.plannedcompletiondate}}</p>
              <p><span class="info-label">当前工艺：</span>{{scope.row.workflowname}}</p>
              <p><span class="info-label">当前工艺版本：</span>{{scope.row.workflowrevision}}</p>
              <p><span class="info-label">机型: </span>{{scope.row.familylistnames}}</p>
            </el-popover>
          </template>
        </el-table-column>
        <!-- 动态模板列 -->
        <el-table-column v-for="col in colums" :label="col.label" :key="col.value" :prop="col.value" width="120"
          align="center" :class-name="(col.day === '0' || col.day === '6')?'green':''" show-overflow-tooltip>
          <template slot-scope="scope">
            <div v-for="i in scope.row[col.value]" @click="showDetailInfo(i)" style="cursor:pointer;">
              <span v-if="i.currentspecid === i.workflowstepid" style="color: red;font-weight: bolder;">
                <i class="el-icon-s-flag" style="font-size: 18px;"></i>
                <el-link type="danger">{{i.workflowstepname}}</el-link>
              </span>
              <span v-else>
                <el-link type="primary">{{i.workflowstepname}}</el-link>
              </span>
              <div style="margin-top: 5px;">
                <span class="info-tag finished" v-if="i.status==='已完工'">{{i.status}}</span>
                <span class="info-tag undo" v-else-if="i.status==='工序不加工'">{{i.status}}</span>
                <span class="info-tag commission-step" v-else-if="i.status==='外委工序'">{{i.status}}</span>
                <span class="info-tag finished" v-else-if="i.status==='完工入库'">{{i.status}}</span>
                <span class="info-tag shipreturn" v-else-if="i.status==='转工已转回'">{{i.status}}</span>
                <span class="info-tag notstart" v-else-if="i.status==='未开始'">{{i.status}}</span>
                <!-- <span class="info-tag dispatched" v-else-if="i.status==='已派工'">{{i.status}}</span> -->
                <span class="info-tag toreceive" v-else-if="i.status==='待领工'">{{i.status}}</span>
                <span class="info-tag toworkreport" v-else-if="i.status==='待报工'">{{i.status}}</span>
                <span class="info-tag reported" v-else-if="i.status==='已报工'">{{i.status}}</span>
                <span class="info-tag part-finished" v-else-if="i.status==='部分完工'">{{i.status}}</span>
                <span class="info-tag commission-sendout" v-else-if="i.status==='外委已转出'">{{i.status}}</span>
                <span class="info-tag commission-return" v-else-if="i.status==='外委已转回'">{{i.status}}</span>
                <span class="info-tag checker-todeal" v-else-if="i.status==='检验待处理'">{{i.status}}</span>
                <span class="info-tag sub-workflowstep" v-else-if="i.status==='子工艺序'">{{i.status}}</span>
                <span class="info-tag ship-reject" v-else-if="i.status==='转工拒收'">{{i.status}}</span>
                <span class="info-tag to-sendout" v-else-if="i.status==='转工待转出'">{{i.status}}</span>
                <span class="info-tag to-receive" v-else-if="i.status==='转工待接收'">{{i.status}}</span>
                <span class="info-tag to-finish" v-else-if="i.status==='转工待完成'">{{i.status}}</span>
                <span class="info-tag to-ship-return" v-else-if="i.status==='转工待转回'">{{i.status}}</span>
                <span class="info-tag to-verify" v-else-if="i.status==='待审理'">{{i.status}}</span>
                <span class="info-tag have-quality-problem" v-else-if="i.status==='有质量问题'">{{i.status}}</span>
              </div>
            </div>
          </template>
        </el-table-column>
      </el-table>

      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
        :current-page="queryInfo.currentPage" :page-sizes="[10,20]" :page-size="queryInfo.pageSize"
        layout="prev,pager,next,jumper,sizes,total" :total="total">
      </el-pagination>

      <!-- 批次信息对话框 -->
      <el-dialog :title="containerInfo.title" :width="'98%'" :top="'10px'" :center="true"
        :visible.sync="containerInfo.dialogVisiable">
        <!-- 批次基本信息 -->
        <el-descriptions title="批次基本信息" border :column="4" style="margin-bottom: 10px;">
          <el-descriptions-item label="流水卡号">
            <el-tag>{{containerInfo.selectContainerInfo.containername}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件图号">
            <el-tag>{{containerInfo.selectContainerInfo.productname}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件名称">
            <el-tag>{{containerInfo.selectContainerInfo.description}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="产品系列">
            <el-tag v-if="containerInfo.selectContainerInfo.productfamilyname">
              {{containerInfo.selectContainerInfo.productfamilyname}}
            </el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件类型">
            <el-tag v-if="containerInfo.selectContainerInfo.producttypename">
              {{containerInfo.selectContainerInfo.producttypename}}
            </el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="订单计划数量">
            <el-tag>{{containerInfo.selectContainerInfo.planqty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="在制数量">
            <el-tag>{{containerInfo.selectContainerInfo.wipqty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="主制工区和班组">
            <el-tag v-if="containerInfo.selectContainerInfo.workcenterandteam">
              {{containerInfo.selectContainerInfo.workcenterandteam}}
            </el-tag>
          </el-descriptions-item>
        </el-descriptions>

        <!-- tabs选项卡 -->
        <el-tabs v-model="containerInfoActiveName">
          <el-tab-pane label="加工信息" name="containerSpecWorkReportData">
            <!-- 加工信息 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="containerInfo.dataList" stripe border height="580">
              <el-table-column type="index" width="50px"></el-table-column>
              <el-table-column label="流水卡号" prop="containername" width="300" show-overflow-tooltip></el-table-column>
              <el-table-column label="工序" prop="workflowstepname" width="200" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工人" prop="workername" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工数" prop="reportqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工时间" prop="reportdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="合格数" prop="eligibilityqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="待审理数" prop="qualityrecordqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报废数" prop="scrapqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="检验类型" prop="checktype" width="100" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </el-dialog>

      <!-- 工序明细对话框 -->
      <el-dialog :title="detail.title" :width="'98%'" :top="'10px'" :center="true" :visible.sync="detail.dialogVisiable"
        @close="dialogClosed">
        <!-- 批次基本信息 -->
        <el-descriptions title="批次基本信息" border :column="5" style="margin-bottom: 10px;">
          <el-descriptions-item label="流水卡号">
            <el-tag>{{detail.selecteSpecInfo.containername}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="当前工艺名称">
            <el-tag>{{detail.selecteSpecInfo.workflowname}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="当前工艺版本">
            <el-tag>{{detail.selecteSpecInfo.workflowrevision}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件图号">
            <el-tag>{{detail.selecteSpecInfo.productname}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件名称">
            <el-tag>{{detail.selecteSpecInfo.productdescription}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="在制数">
            <el-tag>{{detail.selecteSpecInfo.qty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="工序号">
            <el-tag v-if="detail.selecteSpecInfo.specno">{{detail.selecteSpecInfo.specno}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="工序名称">
            <el-tag v-if="detail.selecteSpecInfo.opdesc">{{detail.selecteSpecInfo.opdesc}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="派工班组">
            <el-tag v-if="detail.selecteSpecInfo.teamname">{{detail.selecteSpecInfo.teamname}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="完成数">
            <el-tag v-if="detail.selecteSpecInfo.isreport">{{detail.selecteSpecInfo.reportqty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="合格数">
            <el-tag type="success" v-if="detail.selecteSpecInfo.isreport">{{detail.selecteSpecInfo.passqty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="报废数">
            <el-tag type="danger" v-if="detail.selecteSpecInfo.isreport">{{detail.selecteSpecInfo.lossqty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="超差数">
            <el-tag type="danger" v-if="detail.selecteSpecInfo.isreport">{{detail.selecteSpecInfo.defectqty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="返修数">
            <el-tag type="danger" v-if="detail.selecteSpecInfo.isreport">{{detail.selecteSpecInfo.reworkqty}}</el-tag>
          </el-descriptions-item>
        </el-descriptions>
        <!-- tabs选项卡 -->
        <el-tabs v-model="activeName" @tab-click="tabSelectChange">
          <el-tab-pane label="加工信息" name="reportInfo">
            <!-- 加工信息 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.reportInfoList" stripe border height="400">
              <el-table-column type="index" width="50px"></el-table-column>
              <el-table-column label="工艺版本" prop="workflowrevision" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="派工时间" prop="dispatchdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="派工人" prop="dispatchemployeename" width="80" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="派工数" prop="dispatchqty" width="60" show-overflow-tooltip></el-table-column>
              <el-table-column label="加工设备" prop="dispatchresourcename" width="100" show-overflow-tooltip>
              </el-table-column>
              <!-- <el-table-column label="设备名称" prop="resourcedescription" width="100" show-overflow-tooltip>
              </el-table-column> -->
              <el-table-column label="派给工人" prop="dispatchto" width="140" show-overflow-tooltip></el-table-column>
              <el-table-column label="派工状态" prop="ckpgdstatusname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工时间" prop="reportdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="报工人" prop="reportemployeename" width="80" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="加工班组" prop="teamname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工数" prop="reportqty" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工类型" prop="checktypename" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="检验时间" prop="checkdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="检验人" prop="checkemployeename" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="合格数" prop="passqty" width="60" show-overflow-tooltip></el-table-column>
              <el-table-column label="报废数" prop="lossqty" width="60" show-overflow-tooltip></el-table-column>
              <el-table-column label="超差数" prop="defectqty" width="60" show-overflow-tooltip></el-table-column>
              <el-table-column label="返修数" prop="reworkqty" width="60" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="转工记录" name="shipInfo">
            <!-- 转工记录 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.shipInfoList" stripe border height="400">
              <el-table-column type="index" width="50px"></el-table-column>
              <el-table-column label="转出工序" prop="outspec" width="160" show-overflow-tooltip></el-table-column>
              <el-table-column label="转入工序" prop="inspec" width="160" show-overflow-tooltip></el-table-column>
              <el-table-column label="转出时间" prop="senddate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="转入时间" prop="returndate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="转出人" prop="sendoutepm" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="转入人" prop="returnemp" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="承制分厂接收时间" prop="toacceptdate" width="160" :formatter="replaceDate">
              </el-table-column>
              <el-table-column label="承制分厂完成时间" prop="completedate" width="160" :formatter="replaceDate">
              </el-table-column>
              <el-table-column label="承制分厂接收人" prop="toacceptor" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="承制分厂完成人" prop="recivecompleter" width="80" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="申请人" prop="proposername" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="拒收人" prop="denyperson" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="拒收时间" prop="denydate" width="160" show-overflow-tooltip :formatter="replaceDate">
              </el-table-column>
              <el-table-column label="拒收原因" prop="reasonnote" width="160" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="外委记录" name="commissionInfo">
            <!-- 外委记录 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.commissionInfoList" stripe border height="400">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="转出工序" prop="workflowstepname" width="200" show-overflow-tooltip></el-table-column>
              <el-table-column label="转入工序" prop="inworkflowstepname" width="200" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="转出时间" prop="outdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="转入时间" prop="indate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="转出人" prop="outname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="转入人" prop="inname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="外委厂家" prop="customername" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="外委数" prop="outqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="合格数" prop="acceptanceqty" width="100" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="质量信息" name="qualityInfo">
            <!-- 质量信息 -->
            <el-row :gutter="20">
              <!-- 成品检验信息 -->
              <el-col :span="12">
                <el-card class="box-card">
                  <div slot="header" class="clearfix">
                    <span>成品检验信息</span>
                  </div>
                  <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
                    element-loading-background="rgba(0,0,0,0.8)" :data="detail.finishCheckInfoList" stripe border
                    height="400">
                    <el-table-column type="index" width="50"></el-table-column>
                    <el-table-column label="合格数" prop="acceptanceqty" width="100" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column label="超差数" prop="defectqty" width="100" show-overflow-tooltip></el-table-column>
                    <el-table-column label="返修数" prop="reworkqty" width="100" show-overflow-tooltip></el-table-column>
                    <el-table-column label="报废数" prop="lossqty" width="100" show-overflow-tooltip></el-table-column>
                    <el-table-column label="检验人" prop="fullname" width="100" show-overflow-tooltip></el-table-column>
                    <el-table-column label="检验时间" prop="createdate" width="160" :formatter="replaceDate">
                    </el-table-column>
                  </el-table>
                </el-card>
              </el-col>
              <!-- 报废单 -->
              <el-col :span="12">
                <el-card class="box-card">
                  <div slot="header" class="clearfix">
                    <span>报废单</span>
                  </div>
                  <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
                    element-loading-background="rgba(0,0,0,0.8)" :data="detail.lossInfoList" stripe border height="400">
                    <el-table-column type="index" width="50"></el-table-column>
                    <el-table-column label="流水卡号" prop="containername" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column label="报废数量" prop="scrapqty" width="80" show-overflow-tooltip></el-table-column>
                    <el-table-column label="提交人" prop="fullname" width="80" show-overflow-tooltip></el-table-column>
                    <el-table-column label="报废时间" prop="submitdate" width="160" :formatter="replaceDate">
                    </el-table-column>
                    <el-table-column label="报废原因" prop="lossreasonname" width="200" show-overflow-tooltip>
                    </el-table-column>
                  </el-table>
                </el-card>
              </el-col>
            </el-row>
          </el-tab-pane>

          <el-tab-pane label="检测项信息" name="checkPointResultInfo">
            <!-- 检测项信息 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.checkPointResultInfoList" stripe border
              height="400">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="关键特性标识" prop="name" width="200" show-overflow-tooltip></el-table-column>
              <el-table-column label="检测项内容" prop="checkpointnotedis_b" width="120" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.checkpointnotedis_b">
                  <div v-html="scope.row.checkpointnotedis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="关键过程检" prop="keycheckname" width="120" show-overflow-tooltip></el-table-column>
              <el-table-column label="工序检" prop="meopcheckname" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="质保单" prop="qualitycheckname" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="操作者" prop="workername" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="操作时间" prop="createdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="检验者" prop="checkername" width="120" show-overflow-tooltip></el-table-column>
              <el-table-column label="图纸规定" prop="drawingrequiredis_b" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.drawingrequiredis_b">
                  <div v-html="scope.row.drawingrequiredis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="工人检测值" prop="workcheckpointresultnotedis_b" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.workcheckpointresultnotedis_b">
                  <div v-html="scope.row.workcheckpointresultnotedis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="检验检测值" prop="checkpointresultnotedis_b" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.checkpointresultnotedis_b">
                  <div v-html="scope.row.checkpointresultnotedis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="检测时间" prop="checkdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="子序号" prop="containername" width="120" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="工步加工信息" name="stepInfo">
            <!-- 工步加工信息 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.stepInfoList" stripe border height="400">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="工步号" prop="stepno" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="工步" prop="stepinfodesc" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="派工时间" prop="dispatchdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="派工人" prop="dispatchfullname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="派工数" prop="dispatchqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="加工设备" prop="resourcedesc" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="派给工人" prop="dispatchworkname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工时间" prop="reportdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="报工人" prop="reportemployeename" width="100" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="加工班组" prop="teamname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工数" prop="reportqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="检验人" prop="checkemployeename" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="检验时间" prop="checkdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="合格数" prop="passqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报废数" prop="lossqty" width="100" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="工序不加工" name="undoSpecInfo">
            <!-- 工序不加工 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.undoSpecInfoList" stripe border height="400">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="流水卡号" prop="containername" width="400" show-overflow-tooltip></el-table-column>
              <el-table-column label="工序名称" prop="workflowstepname" width="200" show-overflow-tooltip></el-table-column>
              <el-table-column label="责任人" prop="fullname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="时间" prop="createdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="工序进行状态" prop="noship" width="100" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </el-dialog>

      <el-backtop></el-backtop>
    </div>
  </div>

  <script type="module">
    import { getParams, fetchSuggestion } from '../Scripts/hooks/useCommonMethod.js'
    import { prevWeek, thisWeek, nextWeek, prevMonth, thisMonth, nextMonth } from '../Scripts/hooks/useDateShortCut.js'
    import { getUserInfo, getFactoryListByCode, getWorkcenterList, getProductFamily } from '../Scripts/hooks/fetchAPI.js'
    import { replaceDate } from '../Scripts/hooks/format.js'
    import Vue2ReportHeader from '../Scripts/components/Vue2ReportHeader.js'
    const app = new Vue({
      el: '#app',
      components: { Vue2ReportHeader },
      data: {
        replaceDate,
        total: 0,
        loading: false,
        loadingText: '数据加载中...',
        queryInfo: {
          factoryid: '',
          workcenterid: '',
          mfgordername: '',//订单
          productname: '',//件号
          containername: '',
          workflowid: '',
          productfamilyname: '',
          status: '0',
          selectdate: '',//排产时间
          currentPage: 1,//当前页
          pageSize: 10//每页显示条数
        },
        userInfo: {},
        productfamilyList: [],// 机型
        formDisabled: false,
        // 批次主要信息对话框
        containerInfo: {
          dialogVisiable: false,
          title: '',
          selectContainerInfo: {},
          dataList: []//加工信息
        },
        // 批次各工序详细信息
        detail: {
          dialogVisiable: false, title: '',
          queryInfo: { containerid: '', workflowstepid: '' },
          selecteSpecInfo: {},
          reportInfoList: [],//加工信息
          shipInfoList: [],//转工信息
          commissionInfoList: [],//外委记录
          lossInfoList: [],//报废信息
          finishCheckInfoList: [],//成品检验
          checkPointResultInfoList: [],//检测项
          stepInfoList: [],//工步加工信息
          undoSpecInfoList: [],//工序不加工信息
        },
        colums: [],
        selectdateList: [],
        factoryList: [],
        workcenterList: [],
        dataList: [],//主表格数据
        workflowList: [],
        pickerOptions: { shortcuts: [prevWeek, thisWeek, nextWeek, prevMonth, thisMonth, nextMonth] },
        activeName: 'reportInfo',
        containerInfoActiveName: 'containerSpecWorkReportData',
        factoryDisabled: false,
        containerObj: []
      },
      methods: {
        // 查询订单号
        searchMfgorderAsync(value, callback) {
          fetchSuggestion({ actionName: 'getMfgordernameAsync', name: 'mfgordername', value: value.trim(), callback });
        },
        // 查询件号
        searchProductAsync(value, callback) {
          fetchSuggestion({ actionName: 'getProductnameAsync', name: 'productname', value: value.trim(), callback });
        },
        // 查询批次号
        async searchContainerAsync(value, callback) {
          const data = await fetchSuggestion({ actionName: 'getContainernameAsync', name: 'containername', value: value.trim(), callback });
          this.containerObj = data;
        },
        // 流水卡下拉框选择
        async handleContainernameSelect(item) {
          const { containerid, containername } = item;
          await this.getContainerHistoryWorkflowData({ containerid, containername });
        },
        async containernameBlur() { },
        async bindControl(factoryid) {
          this.queryInfo.workcenterid = null;
          if (factoryid) { this.workcenterList = await getWorkcenterList({ factoryid }); }
        },
        // 查询数据
        async getData() {
          this.colums = [];
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { data: { data, total, meta } } = await axios.post('../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getData', {
            type: 'getData',
            ...this.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          let containerMaxSeq = [];

          for (const i of data) {
            containerMaxSeq.push(i.maxseq);
          }

          for (let i = 1; i <= Math.max(...containerMaxSeq); i++) {
            this.colums.push({ value: `第${i}序`, label: `第${i}序` });
          }

          this.dataList = data;
          this.total = total;
          setTimeout(() => { this.$refs["table"].doLayout(); }, 100);
        },
        // 显示批次主要信息
        async showContainerInfo(row) {
          const { containerid, containername } = row;
          this.containerInfo.title = `批次：${containername} 详细信息`;
          this.containerInfo.dialogVisiable = true;
          this.getContainerMainInfo(containerid);
          this.getContainerSpecWorkReportData(containerid);
        },
        // 批次主要信息
        async getContainerMainInfo(containerid) {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getContainerMainInfo',
            data: { type: 'getContainerMainInfo', containerid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.containerInfo.selectContainerInfo = data[0];
        },
        // 批次加工信息
        async getContainerSpecWorkReportData(containerid) {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getContainerSpecWorkReportData',
            data: { type: 'getContainerSpecWorkReportData', containerid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.containerInfo.dataList = data;
        },

        showDetailInfo(row) {
          const { containername, containerid, workflowstepname, workflowstepid } = row;
          this.detail.title = `批次：${containername} 工序：${workflowstepname} 详细信息`;
          this.detail.dialogVisiable = true;
          this.detail.queryInfo = { containerid, workflowstepid };

          this.getSelecteSpecInfo();

          const { shipstatus, commissionstatus, issubworkflowstatusm, undostatus, iscommissionstepstatus } = row;
          if (shipstatus || issubworkflowstatusm) {
            this.getShipInfo();
            this.activeName = 'shipInfo';
            return;
          }
          if (commissionstatus || iscommissionstepstatus) {
            this.getCommissionInfo();
            this.activeName = 'commissionInfo';
            return;
          }
          if (undostatus) {
            this.getUndoSpecInfo();
            this.activeName = 'undoSpecInfo';
            return;
          }
          this.getWorkreportInfo();
        },
        handleCurrentChange(newPage) {
          this.queryInfo.currentPage = newPage;
          this.getData();
        },
        handleSizeChange(newSize) {
          this.queryInfo.pageSize = newSize;
          this.getData();
        },
        dialogClosed() {
          this.activeName = 'reportInfo';
        },
        // tab选项卡变更事件
        tabSelectChange(tab, event) {
          const { label, paneName } = tab;
          switch (paneName) {
            case "reportInfo":
              this.getWorkreportInfo();//加工信息
              break;
            case "shipInfo":
              this.getShipInfo();//转工记录
              break;
            case "commissionInfo":
              this.getCommissionInfo();//外委记录
              break;
            case "qualityInfo":
              this.getFinishCheckInfo();//成品检验
              this.getLossInfo();//报废信息
              break;
            case "checkPointResultInfo":
              this.getCheckPointResultInfo();//检测项
              break;
            case "stepInfo":
              this.getStepInfo();//工步加工信息
              break;
            case "undoSpecInfo":
              this.getUndoSpecInfo();//工序不加工信息
              break;
            default:
              break;
          }
        },
        // 查询批次历史工艺加工工艺
        async getContainerHistoryWorkflowData(item) {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containername, containerid } = item;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getContainerHistoryWorkflowData',
            data: { type: 'getContainerHistoryWorkflowData', containername, containerid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.workflowList = data;
          this.queryInfo.workflowid = data[0].currentworkflowid;
        },
        //查询所选工序基本信息
        async getSelecteSpecInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getSelecteSpecInfo',
            data: { type: 'getSelecteSpecInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          let reportqty = data.reduce((prev, curr) => prev + curr.reportqty, 0);
          let passqty = data.reduce((prev, curr) => prev + curr.passqty, 0);
          let lossqty = data.reduce((prev, curr) => prev + curr.lossqty, 0);
          let defectqty = data.reduce((prev, curr) => prev + curr.defectqty, 0);
          let reworkqty = data.reduce((prev, curr) => prev + curr.reworkqty, 0);
          let isreport = data.some(i => i.reportqty !== null);
          this.detail.selecteSpecInfo = { ...data[0], reportqty, passqty, lossqty, defectqty, reworkqty, isreport };
        },
        // 工序加工记录信息
        async getWorkreportInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getWorkreportInfo',
            data: { type: 'getWorkreportInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.reportInfoList = data;
        },
        //  工序转工记录
        async getShipInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getShipInfo',
            data: { type: 'getShipInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.shipInfoList = data;
        },
        // 外委记录
        async getCommissionInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getCommissionInfo',
            data: { type: 'getCommissionInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.commissionInfoList = data;
        },
        // 报废信息
        async getLossInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getLossInfo',
            data: { type: 'getLossInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.lossInfoList = data;
        },
        // 成品检验
        async getFinishCheckInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getFinishCheckInfo',
            data: { type: 'getFinishCheckInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.finishCheckInfoList = data;
        },
        // 检测项
        async getCheckPointResultInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getCheckPointResultInfo',
            data: { type: 'getCheckPointResultInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.checkPointResultInfoList = data;
        },
        // 工步加工信息
        async getStepInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getStepInfo',
            data: { type: 'getStepInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.stepInfoList = data;
        },
        // 工序不加工信息
        async getUndoSpecInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: '../handler/board/ContainerCurrentProgressDashBoard.ashx?action=getUndoSpecInfo',
            data: { type: 'getUndoSpecInfo', containerid, workflowstepid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.undoSpecInfoList = data;
        }
      },
      async mounted() {
        this.productfamilyList = await getProductFamily();
        const uid = getParams("uid");
        if (!uid) {
          this.formDisabled = true;
          return this.$notify.error('缺少用户参数');
        }

        const userInfo = await getUserInfo({ employeeid: getParams("uid") });
        if (!userInfo) {
          this.formDisabled = true;
          return this.$notify.error('用户不存在');
        } else {
          this.userInfo = userInfo;
        }

        this.factoryList = await getFactoryListByCode({ factoryCode: '600|601|602|604|607|608|609|619' });
        let factoryid = '';
        if (this.factoryList.some(i => i.factoryid === userInfo.factoryid)) {
          factoryid = userInfo.factoryid;
          this.factoryDisabled = true;
        } else {
          factoryid = this.factoryList[0].factoryid;
        }

        this.queryInfo.factoryid = factoryid;
        this.workcenterList = await getWorkcenterList({ factoryid });

        const maxSeq = 10;
        for (let i = 1; i <= maxSeq; i++) {
          this.colums.push({ value: `第${i}序`, label: `第${i}序` });
        }
        // const start = dayjs().startOf('month').format('YYYY-MM-DD');
        // const end = dayjs().format('YYYY-MM-DD');
        // // 筛选时间默认：本月1日~今天
        // this.queryInfo.selectdate = [start, end];
        // this.getData();
      },
      watch: { queryInfo: { handler() { this.queryInfo.currentPage = 1 }, deep: true } }
    })
  </script>
</body>

</html>